laypage切换一页显示多少条不生效 | 您所在的位置:网站首页 › layui radio不显示 › laypage切换一页显示多少条不生效 |
最近解决一个问题,接口请求传参以及返回值都正确。但是唯独切换每页显示多少条的时候就是不生效。 问题代码如下: //加载layui的table表格 $scope.loadTableFun = function (){ layui.use(['form', 'element', 'table', 'laypage', 'layer', 'upload', 'laydate'], function () { var $ = layui.jquery, form = layui.form, table = layui.table, layer = layui.layer, laypage = layui.laypage, element = layui.element, upload = layui.upload, laydate= layui.laydate; var tableHeader = $scope.searchConditionList.filter(function(sItem){ return sItem.IsListView; }).map(function(tjItem){ tjItem.field = tjItem.name; // tjItem.width = "100"; // tjItem.templet=""+tjItem.labelName+"" if(tjItem.name === 'aptType'){ tjItem.width = "15%"; } else if(tjItem.name === 'kbDesc'){ tjItem.width = "20%"; } tjItem.style = "word-break: break-all"; // tjItem.minWidth = "100"; return tjItem; }); ........ //执行获取分页数据的回调函数 getData(layer,$scope.competorGuide, function(resData){ if(resData.Result){ var allTableData = []; // 把查询接口返回的resData 赋值给 allTableData中即可 allTableData = resData.List.map(function(rdItem){ var tmpObj = Object.assign({},{ID:rdItem.ID}, rdItem.listData); return tmpObj; }); } // 在这里进行table.render table.render({ elem: '#allData' ,id: 'allData' ,data: allTableData ,cols: [tableHeader] ,done: function (res, curr, count) { // 分页 laypage.render({ elem: 'paging' , curr: $scope.pageInfo.pageIndex , count: resData.Total , limit: $scope.pageInfo.pageSize , limits: [5, 10, 15, 20] , layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'] ,prev: '' ,next: '' ,first: '' ,last: '' , jump: function (obj, first) { $scope.pageInfo.pageIndex = obj.curr; $scope.pageInfo.pageSize = obj.limit; if (!first) { $scope.loadTableFun(); } return false; } }); //监听工具条 编辑、删除、预览、下载 table.on("tool(allData)", function (obj) { var data = obj.data, events = obj.event, tr = obj.tr; //获得当前行 tr 的DOM对象; switch(events){ case "allData_edit": ...... //编辑的方法 break; case "allData_del": layer.confirm('确认要删除?', {icon: 3, title:'提示'}, function(index){ ....... //删除的方法 layer.close(index); }); break; } }); } ,limit: 5 //每页默认显示的数量 }); }); }); }如果单独看laypage,一直找不到任何问题。最终找到,问题不在laypage上,问题在table的limit属性上。把limit改成$scope.pageInfo.pageSize变量即可。之前是写死的数值5。 table.render({ elem: '#allData' ,id: 'allData' ,data: allTableData ,cols: [tableHeader] ,done: function (res, curr, count) { //laypage 分页初始化 laypage.render({ elem: 'paging' , curr: $scope.pageInfo.pageIndex , count: resData.Total , limit: $scope.pageInfo.pageSize , limits: [5, 10, 15, 20] , layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'] ,prev: '' ,next: '' ,first: '' ,last: '' , jump: function (obj, first) { console.info("分页---jump===",obj,first); $scope.pageInfo.pageIndex = obj.curr; $scope.pageInfo.pageSize = obj.limit; if (!first) { $scope.loadTableFun(); } return false; } }); }, ,limit: $scope.pageInfo.pageSize //每页默认显示的数量 }); |
CopyRight 2018-2019 实验室设备网 版权所有 |